<template>
  <div id="">
    <img :src="houseInfo.imgUrl" alt="">
    <div class="houseinfoCon">
      <p>{{houseInfo.title}}</p>
      <div class="">
        <em>{{houseInfo.des}}-{{houseInfo.scale}}</em>
        <span>{{houseInfo.price}}元/月</span>
      </div>
    </div>
  </div>
</template>
<script>
export default {
  name: "houseList",
  props: ['houseInfo'],
  data: () => ({

  }),
  mounted() {
    //do something after mounting vue instance
    // console.log(this.houseInfo);
  }
}
</script>
<style lang="scss" scoped>
 

  img{
    width: 100%;
  }
  .houseinfoCon{
    padding: 10px;
    div{
      @include flex;
      justify-content: space-between;
      font-size:0.8rem;

      span{
        color: $redColor;
      }
    }
  }

</style>
